@import url(http://fonts.googleapis.com/css?family=Oleo+Script:700);

html, body, .f-index{
	width: 100%; height: 100%;
	position: relative;
}

.opacity{
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
	filter: alpha(opacity=75);
	-moz-opacity: 0.8;
	-khtml-opacity: 0.8;
	opacity: 0.8;
}

.logo h1{
	line-height: 0px;
	margin: 0;
}

.f-header{
	height: auto;
	.logo{
		float: left;
		width:180px;
		height:130px;
		background: #ffffff;
		background:url("../img/riha.png") top left rgba(255, 255, 255, 0.7) no-repeat;
		background-size:30%;
		border-radius:  0 0 100% 100%;
		-webkit-border-radius:  0 0 100% 100%;
		-moz-border-radius:  0 0 100% 100%;
		behavior: url("../js/PIE.htc");
		.opacity;
		img{
			width: 80%;
			margin: 10px 20px;
		}
	}
	h2{
		float: left;
		margin-top: 50px; margin-left: 30px;
		color: rgba(255, 255, 255, 0.7);
		font-family: 'Oleo Script', cursive;
		font-weight: 700;
		.opacity;
	}
}
.f-menu{
	overflow: visible;
	height: 173px;
	position: absolute;
	top: 0; right: 0; bottom: 0; left: 0;
	margin: auto;
	ul{
		margin: 0;
		li{
			float: left;
			min-width: 180px;
			div.f-menuItem{
				overflow: hidden;
				width: 180px;
				border-radius: 10px;
				-webkit-border-radius: 10px;
				-mox-border-radius: 10px;
				behavior: url("../js/PIE.htc");
				background: #61A60D;
				border: 3px solid #50A176;
				.opacity;
				.f-titleContainer{
					min-height: 94px;
					div.f-image{
						overflow: hidden;
						height: 51px;
						border-radius:  8px 8px 0 0;
						-webkit-border-radius:  8px 8px 0 0;
						-moz-border-radius:  8px 8px 0 0;
						behavior: url("../js/PIE.htc");
						img{
							width: 100%;
						}
					}
					.f-title{
						display: block;
						height: 43px;
						font-weight: 800;
						line-height: 43px;
						text-align: center;
						text-decoration: none;
						background: url();
						background: -moz-linear-gradient(top,  rgba(255,255,255,0.36) 0%, rgba(255,255,255,0) 100%);
						background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0.36)), color-stop(100%,rgba(255,255,255,0)));
						background: -webkit-linear-gradient(top,  rgba(255,255,255,0.36) 0%,rgba(255,255,255,0) 100%);
						background: -o-linear-gradient(top,  rgba(255,255,255,0.36) 0%,rgba(255,255,255,0) 100%);
						background: -ms-linear-gradient(top,  rgba(255,255,255,0.36) 0%,rgba(255,255,255,0) 100%);
						background: linear-gradient(to bottom,  rgba(255,255,255,0.36) 0%,rgba(255,255,255,0) 100%);
						filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5cffffff', endColorstr='#00ffffff',GradientType=0 );
					}
					.f-title:hover{ text-decoration: underline;}
				}
				.f-subMenu{
					display: none;
					padding: 0 5px;
					margin: 0;
					li{
						float: none;
						width: 100%; min-width: 100%; height: auto;
						margin: 5px 0;
						border-top: 1px dashed rgba(255, 255, 255, 0.5);
						list-style: none;
						text-align: center;
						a{
							text-decoration: none;
							font-size: 12px;
							text-align: center;
						}
						a:hover{
							text-decoration: underline;
						}
					}
				}
				.f-subText{
					display: none;
					padding: 5px 10px;
					font-size: 12px;
				}
			}
			div.f-menuItem:hover{
				position: relative;
				z-index: 1000;
			}
		}
		li:first-child{
			margin-left: 0;
		}
		li:nth-child(odd) div.f-menuItem{
			background:#61a60d;
			border: 3px solid #50A176;
		}
		li:nth-child(even) div.f-menuItem{
			background:#f6a702;
			border: 3px solid #f6a702;
		}
	}
}

.f-footer{
	position: absolute;
	bottom: 0; left: 0; right: 0;
	margin: auto; padding: 10px 0;
	background: #ffffff;
	.opacity;
	p{
		margin: 0;
	}
	.f-language{
		width: 190px;
		margin: 0 auto;
		overflow: hidden;
		li{
			float: left;
			list-style: none;
			margin: 0 5px 0;
			a{
				font-size: 12px;
				color: #498E2D;
			}
		}
	}
}